/**
 * Created by liguangsong on 16/8/4.
 */
import React, { Component } from 'react'
import TeamRankInfo from './oneTeamRankInfo.js'
var getJson = require('../../assist/getJson');
import { connect } from 'react-redux'

var style = {
    position: 'absolute',
    width: '100%',
    height: '1380px',
    background: 'white',
    top: '363px',
    left: '0',
    overflow: 'scroll'
};

class ReactRankView extends Component {
    constructor(props) {
        super(props);
        this.getRankArray();

        this.state = {
            eastTeamArray: [],
            westTeamArray: []
        };
    }

    getRankArray() {

        for (var i = 1610612737; i <= 1610612766; i++ ) {
            var url = "teaminfocommon?LeagueID=00&SeasonType=Regular+Season&TeamID=" + i + "&season=2015-16";
            getJson(url, function(result) {
                this.getTeamArray(result);
            }.bind(this));

        }
    }

    getTeamArray(result) {
        var eastArray = this.state.eastTeamArray;
        var westArray = this.state.westTeamArray;
        if (result["resultSets"][0]["rowSet"][0][5] === 'West') {
            westArray.push(result["resultSets"]);
        }
        else {
            eastArray.push(result["resultSets"]);
        }

        this.setState({
            easrTeamArray: eastArray,
            westTeamArray: westArray
        });
    }


    sortByMark(teamArr) {
        var array = [];
        for (var i = 0; i < teamArr.length; i++) {
            var index = teamArr[i][0]['rowSet'][0][11];
            //console.log(index);
            array[index - 1] = teamArr[i];
        }

        return array;
    }

    getBackColor(index) {
        var backColor = '';
        if (index % 2 == 0) {
            backColor="rgb(245, 245, 245)";
        }
        else {
            backColor = "rgb(234, 237, 240)";
        }
        return backColor;
    }


    getTeamRankInfoView(sortArray) {
        sortArray = this.sortByMark(sortArray);

        var view = [];
        for (var i = 0; i < sortArray.length; i++) {

            if (sortArray[i] == undefined) {
                break;
            }

            var backColor = this.getBackColor(i);
            var info = sortArray[i][0]['rowSet'][0];

            view.push(
                <TeamRankInfo key={i} backColor={backColor} rank={info[11]} city={info[2]==='LA'?'Los Angeles':info[2]} name={info[3]}
                              mark={ info[8].toString() + '-' + info[9].toString() } imgName={ info[4]==='HOU'?'hou2':info[4] }
                              conference={info[5]} division={info[6]} ppg={sortArray[i][1]['rowSet'][0][3]} rpg={sortArray[i][1]['rowSet'][0][5]}
                              apg={sortArray[i][1]['rowSet'][0][7]}  oppg={sortArray[i][1]['rowSet'][0][9]} conferemceRank={info[11]} divisionRank={info[12]}
                              teamId={sortArray[i][1]['rowSet'][0][2]}
                    />
            );
        }


        return view;

    }


    render() {
        //console.log('render');
        var teamArr;
        if (this.props.teamType === 'west') {
            teamArr = this.state.westTeamArray;
        }
        else {
            teamArr = this.state.eastTeamArray;
        }
        //var westSortArray =  this.sortByMark(this.state.westTeamArray);
        //var eastSortArray =  this.sortByMark(this.state.eastTeamArray);
        //console.log(westSortArray);
        return (
            <div style={style} ref="teamView" id="teamView">
                { this.getTeamRankInfoView(teamArr) }
            </div>
        );
    }

    componentDidUpdate() {
        //console.log('componentDidUpdate');
        //var d = document.getElementById('teamView');
        //console.log(d);
        //console.log('---------------');
        //console.log(this.refs.teamView);
    }


}

function select(state) {
    return {
        teamType: state.selectConference.teamType
    }
}

export default connect(select)(ReactRankView);
//export default ReactRankView;